<!--
 * @Description: In User Settings Edit
 * @Author: your name
 * @Date: 2019-07-31 17:46:49
 * @LastEditTime: 2019-11-28 15:58:02
 * @LastEditors: Please set LastEditors
 -->
<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport"
        content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>Hello APP</title>
    <link rel="stylesheet" type="text/css" href="../../css/vant.css">
    </link>
    <link rel="stylesheet" type="text/css" href="../../css/base.css">
    </link>
    <link rel="stylesheet" href="../../css/elementui.css">
    <script type="text/javascript" src="../../script/jquery.js"></script>
    <script type="text/javascript" src="../../script/layer/mobile/layer.js"></script>
    <script type="text/javascript" src="../../script/vue.min.js"></script>
    <script type="text/javascript" src="../../script/vant.min.js"></script>
    <script type="text/javascript" src="../../script/fastclick.js"></script>
    <script src="../../script/elementui.js"></script>
    <script type="text/javascript" src="../../script/base.js"></script>
    <script type="text/javascript" src="../../script/JSLINQ.js"></script>
    <style type="text/css">
        body {
            zoom: 0.9;
        }

        .van-search {
            padding: 6px 0;
            border-bottom: 1px solid #ebedf0;
        }

        .van-search__action {
            color: #cd1b21;
            font-size: 13px;
            font-weight: 700;
        }

        .result {
            overflow-y: auto;
            -webkit-overflow-scrolling: touch;
        }

        .desc {
            color: #969799;
        }

        .selections {
            padding: 5px;
            overflow: auto;
        }

        .van-tag {
            margin-left: 5px;
        }

        .mainBox {
            display: flex;
        }

        .mainBox .main_left {
            width: 42% !important;
            background-color: #e6e6e6;
            height: 100vh;
            overflow: auto;
        }

        #app>.box .mainBox .content {
            height: 100vh !important;
            width: 100% !important;
        }

        .el-tree {
            min-width: 40%;
        }

        .el-tree-node>.el-tree-node__content {
            padding-top: 20px !important;
            padding-bottom: 20px !important;
        }
    </style>
</head>

<body>
    <div id="app" v-cloak>
        <div class="box">
            <van-nav-bar-main title="筛选" left-arrow @click-left="onClickLeft">
            </van-nav-bar-main>

            <div class="mainBox">
                <!-- <div class="main_left">
                    <div style="border-right: 1px solid #e6e6e6;">
                        <el-tree :data="datas" :expand-on-click-node="false" :default-expanded-keys="treeData"
                            node-key="ClassID" :props="defaultProps" @node-click="handleNodeClick"></el-tree>
                    </div>
                </div> -->

                <div class="content flex-box flex-direction-c">
                    <div>
                        <form action="">
                            <van-search v-model="searchKey" placeholder="请输入搜索关键词" show-action @input="getSearchList">
                                <!-- <div slot="action" @click="getSearchList">查询</div> -->
                            </van-search>
                        </form>
                    </div>
                    <div class="flex-main result">
                        <div>
                            <van-cell v-for="row in filterResult" clickable @click="selectRow(row)" v-if="!row.isHide">
                                <div>
                                    <div>{{row.EmplName}}</div>
                                </div>
                            </van-cell>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>

<script type="text/javascript">
    var vm;
    apiready = function () {
        //$('.init-full').show();
        vm = new Vue({
            el: '#app',
            data: {
                datas: [],
                treeData: [],
                defaultProps: {
                    label: 'ClassName',
                },
                filterResult: [],
                searchKey: '',
                cmd: api.pageParam.cmd
            },
            created: function () {
                var that = this
                that.getLeftInfo()
            },
            methods: {
                onClickLeft() {
                    api.closeWin();
                },
                getLeftInfo() {
                    var that = this
                    APP.ajax(api.pageParam.cmd, {}, function (res) {
                        console.log('BMres', JSON.stringify(res))
                        that.filterResult = res.ds
                    })
                },
                // handleNodeClick(data) {
                //     var that = this
                //     console.log(JSON.stringify(data));
                //     console.log(JSON.stringify(that.cmd));
                //     that.filterResult = []
                //     APP.ajax(that.cmd, {}, function (res) {
                //         console.log(res)
                //         res.ds.map((item) => {
                //             if (item.ClassID == data.ClassID) {
                //                 that.filterResult.push(item)
                //             }
                //         })
                //     })
                // },
                selectRow(row) {
                    var that = this
                    console.log('row', JSON.stringify(row))
                    api.sendEvent({
                        name: 'selectRow',
                        extra: {
                            type: '大工单子表人员',
                            row: row
                        }
                    });
                    api.closeWin();
                },
                getSearchList() {
                    var that = this
                    if (that.searchKey) {
                        APP.ajax(api.pageParam.cmd, {
                            EmplName: that.searchKey
                        }, function (res) {
                            console.log(JSON.stringify(res))
                            that.filterResult = res.ds

                            // res.ds.map((item) => {
                            //     // if (item.EmplName.indexOf(that.searchKey) > -1) {
                            //     // if (item.EmplName.includes(that.searchKey)) {
                            //     //     that.filterResult.push(item)
                            //     // }
                            // })
                        })
                    } else {
                        that.filterResult = []
                    }
                }
            }
        })
    };
</script>

</html>